﻿@model CommonApp.Models.UserRequest

@{
    ViewBag.Title = "Submit User Request";
}

@Html.ValidationSummary(true, "Request submission was unsuccessful. Please correct the errors and try again.")

@using (Html.BeginForm("Register", "Admission"))
{  
    <div>
        <div style="text-align: center; margin: 10px 0;">
            <input type="submit" value="Request IBank service" />
        </div>
    </div>
    
    <p>
        Please, fill in your data. All the fields are mandatory.<br/>
        Passwords are required to be a minimum of @Membership.MinRequiredPasswordLength characters in length.
    </p>

    <div id="formTabs">
        <ul>
            <li><a href="#identityView">Personal details</a></li>
            <li><a href="#securityView">Security settings</a></li>
        </ul>

        <div id="identityView">
            <fieldset>
                <legend>Personal details</legend>
                
                <!-- First Name -->
                <div class="editor-label">
                    @Html.LabelFor(m => m.FirstName)
                </div>

                <div class="editor-field">
                    @Html.TextBoxFor(m => m.FirstName)
                    @Html.ValidationMessageFor(m => m.FirstName)
                </div>
            
                <!-- Last Name -->
                <div class="editor-label">
                    @Html.LabelFor(m => m.LastName)
                </div>

                <div class="editor-field">
                    @Html.TextBoxFor(m => m.LastName)
                    @Html.ValidationMessageFor(m => m.LastName)
                </div>
            
                <!-- Date of Birth -->
                <div class="editor-label">
                    @Html.LabelFor(m => m.DateOfBirth)
                </div>

                <div class="editor-field">
                    @Html.TextBoxFor(m => m.DateOfBirth)
                    @Html.ValidationMessageFor(m => m.DateOfBirth)
                </div>
                
                <script>
                    $(function () {
                        $("#DateOfBirth").datepicker();
                    });
                </script>
                
                <!-- Passport Series -->
                <div class="editor-label">
                    @Html.LabelFor(m => m.PassportSeries)
                </div>

                <div class="editor-field">
                    @Html.TextBoxFor(m => m.PassportSeries)
                    @Html.ValidationMessageFor(m => m.PassportSeries)
                </div>
                
                <!-- Passport number -->
                <div class="editor-label">
                    @Html.LabelFor(m => m.PassportNumber)
                </div>

                <div class="editor-field">
                    @Html.TextBoxFor(m => m.PassportNumber)
                    @Html.ValidationMessageFor(m => m.PassportNumber)
                </div>
            </fieldset>
        </div>
        
        <div id="securityView">
            <fieldset>
                <legend>Security settings</legend>
                
                <!-- Login -->
                <div class="editor-label">
                    @Html.LabelFor(m => m.Login)
                </div>

                <div class="editor-field">
                    @Html.TextBoxFor(m => m.Login)
                    @Html.ValidationMessageFor(m => m.Login)
                </div>
                
                 <!-- Email -->
                <div class="editor-label">
                    @Html.LabelFor(m => m.Email)
                </div>

                <div class="editor-field">
                    @Html.TextBoxFor(m => m.Email)
                    @Html.ValidationMessageFor(m => m.Email)
                </div>
                
                <!-- Password -->
                <div class="editor-label">
                    @Html.LabelFor(m => m.Password)
                </div>

                <div class="editor-field">
                    @Html.PasswordFor(m => m.Password)
                    @Html.ValidationMessageFor(m => m.Password)
                </div>
                
                <!-- Password confirmation -->
                <div class="editor-label">
                    @Html.LabelFor(m => m.ConfirmPassword)
                </div>

                <div class="editor-field">
                    @Html.PasswordFor(m => m.ConfirmPassword)
                    @Html.ValidationMessageFor(m => m.ConfirmPassword)
                </div>
            </fieldset>
        </div>
    </div>
}

<script type="text/javascript">
    $(function() {
        $("#formTabs").tabs();
    });
</script>

